<div class="subheader" ng-if="model.decisionTable">
  <div class="fixed-container">
    <div class="btn-group pull-right" ng-if="!(currentKickstartModel)">
      <button class="btn btn-default" ng-click="openEditor()" ng-if="model.decisionTable.latestVersion"
              type="button">
        <i class="glyphicon glyphicon-edit icon-and-label"></i> {{'DECISION-TABLE.ACTION.OPEN-IN-EDITOR' |
        translate}}
      </button>
      <button class="btn btn-default" ng-click="useAsNewVersion()" ng-if="!model.decisionTable.latestVersion"
              type="button">
        {{'DECISION-TABLE.ACTION.USE-AS-NEW-VERSION' | translate}}
      </button>
    </div>

    <div class="btn-group pull-right" ng-if="!(currentKickstartModel)">
      <a class="btn btn-default" href="{{model.decisionTableDownloadUrl}}"
         title="{{'DECISION-TABLE.ACTION.EXPORT' | translate}}">
        <i class="glyphicon glyphicon-save"></i>
      </a>
    </div>

    <div class="btn-group pull-right" ng-if="!(currentKickstartModel)">
      <button class="btn btn-default" ng-click="editDecisionTable()" ng-disabled="!model.decisionTable.latestVersion"
              title="{{'DECISION-TABLE.ACTION.EDIT' | translate}}"
              type="button">
        <i class="glyphicon glyphicon-pencil"></i>
      </button>
      <button class="btn btn-default" ng-click="duplicateDecisionTable()"
              ng-disabled="!model.decisionTable.latestVersion"
              title="{{'DECISION-TABLE.ACTION.DUPLICATE' | translate}}"
              type="button">
        <i class="editor-icon editor-icon-copy"></i>
      </button>
      <button class="btn btn-default" ng-click="deleteDecisionTable()" ng-disabled="!model.decisionTable.latestVersion"
              title="{{'DECISION-TABLE.ACTION.DELETE' | translate}}"
              type="button">
        <i class="glyphicon glyphicon-trash"></i>
      </button>
    </div>
    <div class="pull-right" ng-if="!(currentKickstartModel)">
      <a class="action" ng-click="returnToList()">&larr; {{'GENERAL.ACTION.RETURN-TO-LIST' | translate}}</a>
    </div>

    <h2><span class="version">v{{model.decisionTable.version}}</span>{{model.decisionTable.name}}</h2>
    <div class="clearfix">
      <div class="col-xs-4 details">
                <span><i class="glyphicon glyphicon-user"></i><span translate="DECISION-TABLE.DETAILS.CREATED-BY"
                                                                    translate-values="model.decisionTable"></span></span>
        <span><i class="glyphicon glyphicon-pencil"></i><span translate="DECISION-TABLE.DETAILS.LAST-UPDATED-BY"
                                                              translate-values="model.decisionTable"></span></span>
      </div>
      <div class="col-xs-8 details clearfix">
        <div class="related btn-group">
          <button class="btn btn-subtle" id="toggle-history" ng-click="toggleHistory($event)"
                  ng-if="!(currentKickstartModel)"
                  title="{{'DECISION-TABLE.ACTION.EDIT' | translate}}"
                  type="button">
            {{'DECISION-TABLE.DETAILS.HISTORY-TITLE' | translate}} <span class="counter"
                                                                         ng-show="model.versions.data.length">{{model.versions.data.length}}</span>
          </button>
        </div>
        <p ng-if="model.decisionTable.description">
          {{model.decisionTable.description}}
        </p>
      </div>
    </div>
  </div>
</div>
<div auto-height class="container-fluid content decision-table read-only" ng-if="model.decisionTable" offset="40">

  <div class="decision-table-grid-wrapper" id="decisionTableGrid">
    <div class="decision-name-container">
      <div class="decision-name">
        {{currentDecisionTable.name}}
      </div>
    </div>
    <hot-table auto-row-size="'true'" class="decision-table-editor"
               columns="model.columnDefs"
               datarows="model.rulesData"
               height="500"
               hot-auto-destroy
               hot-id="read-only-decision-table-editor"
               on-after-get-col-header=doAfterGetColHeader
               on-after-render=doAfterRender
               on-after-validate=doAfterValidate
               on-modify-col-width=doAfterModifyColWidth
               row-headers="true"
               settings="model.hotSettings">
    </hot-table>
  </div>
</div>

<script>
    function triggerExpressionEditor(expressionType, expressionPos, newExpression) {
        if (expressionType === 'input') {
            extScope.openInputExpressionEditor(expressionPos, newExpression);
        } else {
            extScope.openOutputExpressionEditor(expressionPos, newExpression);
        }
    }

    function triggerHitPolicyEditor() {
        extScope.openHitPolicyEditor();
    }
</script>
